<script src="../asynx.js"></script>
<script src="../dom/dom.js"></script>
<script src="../impl/array.js"></script>
<script src="../impl/util.js"></script>
<script src="../impl/cookie.js"></script>
<script src="../impl/ajax.js"></script>
<script src="../impl/lang.js"></script>
<script src="../dom/xpath.js"></script>
<script src="../dom/selector.js"></script>
<script src="../event/event.js"></script>

<script src="../plugins/drag/drag.js"></script>
<script src="../plugins/animation/anim.js"></script>
<script src="../plugins/datalist/datalist.js"></script>
<script src="../plugins/autocomplete/autocomplete.js"></script>

<div id="titulo">asynx Drag</div><br>
<div id="log">LOG<br></div><br>

<div id="sDrag" ok="true">
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDragSimpleDragSimpleDragSimpleDragSimpleDragSimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
	SimpleDrag<br>
</div>

<div id="sDrag2" ok="true">
	SimpleDrag<br>
	<div>sdfgsdfgsdfgsdfg</div>
	<input type="text">
</div>


<br>

<select></select>
<button id='rem'>remover</button>

<input type="text" value="dsfsd" id="focuss">

<script>

asynx("//div[@ok]").css({
	bg: '#E8EEF7',
	height: '200px',
	width: '200px',
	position: 'absolute',
	border:'3px #C3D9FF solid',
	overflow:'auto'
	//padding:'20px',
	//margin:'20px'
});


var d2 = new asynx.drag('sDrag2');


d2.onStartDrag = function(el, e) {
	this.setOnTop(true);
}


var d = new asynx.drag('sDrag');

d.fixzIndex();

var fo;

d.onStartDrag = function(el, e) {
	log('Start Dragging...');
	asynx(el).css({opacity:50,cursor:'move'});
	this.setOnTop(true);
}

d.onDrag = function(el, e) {
}

d.onEndDrag = function(el, e) {
	asynx(el).css({opacity:100,cursor:'auto'});
	log('End drag.')
}

</script>